<template>
	<div class="madp-back">
		<div class="madp-back-btn" @click="goBack">
			<i class="el-icon-back"></i>
			返回
		</div>
		<div class="madp-back-title">
			{{ title }}
		</div>
		<div class="madp-back-line"></div>
	</div>
</template>

<script>
export default {
	props: ['title'],
	data() {
		return {}
	},
	methods: {
		goBack() {
			this.$emit('goBack')
		},
	},
}
</script>

<style lang="scss" scoped>
.madp-back {
	position: absolute;
	z-index: 999;
	width: calc(100% - 20px);
	margin: -20px 0 0 -20px;
	padding-top: 10px;
	background-color: #ffffff;
	&-btn {
		display: inline-block;
		padding: 0 20px 10px;
		cursor: pointer;
		line-height: 32pxx;
	}
	&-title {
		display: inline-block;
		padding-left: 20px;
		font-size: 17px;
		border-left: 1px solid #666;
	}
	&-line {
		width: 100%;
		height: 10px;
		background-color: #f0f2f5;
	}
}
</style>